<script>

export default {
  props: ['treeData', 'fetchTreeData', 'selectedIdUpdate'],
  watch: {
    selectedIdUpdate(n, o) {
      if (n !== o) {
        this.detailOrAdd.data = this.parentTable.item
      }
    }
  },
  data() {
    return {
      parentTable: {
        item: null
      },
      detailOrAdd: {
        data: {
          sort: 999
        }
      },
      virtualTypeList: {
        data: [
          {code: 'Y', name: '是'},
          {code: 'N', name: '否'}
        ]
      }
    }
  },
  mounted() {
    this.parentTable = this.treeData
    if (this.parentTable.item) {
      this.detailOrAdd.data = this.parentTable.item
    }
  },
  methods: {
    formCancel: function () {
      this.fetchTreeData()
    },
    formSubmit: function () {
      this.$refs.form.validate((valid) => {
        if(valid) {
          this.saveOrUpdate(this.detailOrAdd.data)
        }else {
          return false
        }
      })
    },
    saveOrUpdate: function (data) {
      const param = {}
      for (let k in data) {
        const v = data[k]
        if (v instanceof Object) {
          param[k] = JSON.stringify(v)
        }else {
          param[k] = v
        }
      }
      this.$axios({url:'/ems/client/base/diagram/update',data: {content: param}}).then((content) => {
        if (content) {
          this.$message("保存成功")
          this.formCancel()
        }
      });
    }
  }
}
</script>

<template>
  <el-form ref="form" :model="detailOrAdd.data" label-width="150px">
    <el-row style="margin-top: 20px;">
      <el-col :span="6">&nbsp;</el-col>
      <el-col :span="12">
        <el-form-item label="ID">
          <el-input v-model="detailOrAdd.data.id" style="width: 250px;" disabled></el-input>
        </el-form-item>
        <el-form-item prop="name" label="节点名称" label-width="150px" :rules="[{ required: true, message: '不能为空'}]">
          <el-input v-model="detailOrAdd.data.name" style="width: 250px;"></el-input>
        </el-form-item>
        <el-form-item prop="virtual" label="是否虚拟" :rules="[{ required: true, message: '不能为空'}]">
          <el-select v-model="detailOrAdd.data.virtual" placeholder="是否虚拟">
            <el-option v-for="item in virtualTypeList.data" :key="item.code" :label="item.name" :value="item.code"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="sort" label="排序" label-width="150px" :rules="[{ required: true, message: '不能为空'}]">
          <el-input v-model="detailOrAdd.data.sort" style="width: 250px;"></el-input>
        </el-form-item>
        <el-form-item label="扩展信息（报表可用）" label-width="150px">
          <el-input v-model="detailOrAdd.data.ext" style="width: 250px;"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">&nbsp;</el-col>
    </el-row>
    <el-row style="text-align: right">
      <el-col :span="6">&nbsp;</el-col>
      <el-col :span="12">
        <el-button type="primary" @click="formSubmit">提交</el-button>
        <el-button @click="formCancel" style="margin-right: 10%;">取消</el-button>
      </el-col>
      <el-col :span="6">&nbsp;</el-col>
    </el-row>
  </el-form>
</template>

<style>

</style>
